<template>
  <div>
    <Banner></Banner>
    <container :data="list" @get-detailed="handleGetDetailed" @get-more="handleGetMore"></container>
    <router-view></router-view>
  </div>
</template>

<script>
import Banner from '@/components/indexBox/banner.vue'
import Container from '@/components/indexBox/container.vue'
//vuex
import { mapState } from 'vuex'
export default {
  //数据调用
  computed: {
    ...mapState(['list']),
  },
  components: {
    Banner,
    Container,
  },
  data() {
    return {

    }
  },
  methods: {
    handleGetDetailed(id) {
      // 处理传递过来的 id
      // console.log(id);
      // 存储到父组件的数据中
      this.$router.push({
        name: 'detailed', // 使用路由名称
        params: {
          id: id, // 使用路由参数
        }
      })
    },
    handleGetMore() {
      this.$router.push('/home/commodity')
    }


  }
}
</script>
<style></style>
